<template>
  <div class="big_box">
    <el-upload
      :action="http+'/admin/MemberApply/upload'"
      :multiple='false'
      :name='"img"'
      v-show="false"
    >
    上传
    </el-upload>
    <div class="conter_box">
      <div class="conter_item_left">
        <div>
          <div class="img_box">
            <img v-if="qylogo" :src="qylogo" alt="" />
          </div>
          <div class="box_title">
            <p>{{qyname.split('/')[0]}}{{qyname.includes('/')?qyname.split('/')[1]:''}}</p>
          </div>
        </div>
        <div class="no_copy">Copyright &copy; 2020-2022.All Rights Reserved. 鲁ICP备14014132号-2</div>
      </div>
      <div class="conter_item_right">
        <div class="positionA"></div>
        <div class="positionB"></div>
        <div class="positionC">
          <div class="box_form">
            <div class="box_form_title">
              <p>学习报名</p>
            </div>
            <el-form label-position="left" label-width="120px" :model="formLabelAlign" v-loading="loading">
              <el-form-item label="培训大类" required>
                <el-select v-model="formLabelAlign.gz" placeholder="请选择" @change="gzChange">
                  <el-option v-for="item in GZList" :key="item" :label="item" :value="item"> </el-option>
                </el-select>
              </el-form-item>

              <el-form-item
                v-if="(formLabelAlign.gz == '一般工贸' || formLabelAlign.gz == '安全管理') && (http.indexOf('bbxdf') != -1 || http.indexOf('test') != -1)"
                label="单位类型"
                required
              >
                <el-select v-model="formLabelAlign.extra.CNPtype" placeholder="请选择">
                  <el-option v-for="item in typeList" :key="item" :label="item" :value="item"> </el-option>
                </el-select>
              </el-form-item>
              
              <el-form-item
                v-if="(formLabelAlign.gz == '一般工贸' || formLabelAlign.gz == '安全管理') && (http.indexOf('bbxdf') != -1 || http.indexOf('test') != -1)"
                label="所在地域"
                required
              >
                <el-select v-model="formLabelAlign.extra.address" placeholder="请选择">
                  <el-option v-for="item in addressList" :key="item" :label="item" :value="item"> </el-option>
                </el-select>
              </el-form-item>
              <div v-if="http.indexOf('taihua') == -1 || (http.indexOf('taihua') != -1 && formLabelAlign.gz != '学历提升')">
                <el-form-item
                  :label="item.field_type == 'json' ? '' : item.label"
                  v-for="item in fromList"
                  :key="item.id"
                  :required="Boolean(item.selected)"
                  v-show="item.isshow"
                  :class="item.field_type == 'json' ? 'classJson' : ''"
                >
                  <span v-if="item.hint" style="color: red; line-height: 20px !important">{{ item.hint }}</span>
                  <el-cascader
                    style="width: 100%"
                    v-if="item.field_type == 'select' && item.label == '培训科目'"
                    v-model="subjectlist"
                    @change="subChange"
                    class="filter-item"
                    placeholder="请选择培训科目"
                    clearable
                    :options="subjectListTree"
                    :props="{ label: 'title', value: 'id', key: 'id' }"
                    ref="elcascader"
                  ></el-cascader>
                  <!-- <a-cascader 
                    v-if="item.field_type=='select'&&item.label=='培训科目'" 
                    style="width:100%"
                    :options="subjectListTree" 
                    placeholder="请选择培训科目"
                    v-model="subjectlist"
                    :fieldNames="{label:'title',value:'id',children:'children'}"
                    @change="subChange" /> -->

                  <el-input v-model="item.placeholder" v-else-if="item.field_type == 'input' && http.indexOf('lyjc') == -1" @change="inputChange(item)"></el-input>
                  <el-input
                    v-model="item.placeholder"
                    v-else-if="item.field_type == 'input' && http.indexOf('lyjc') != -1 && item.label != '学历起止时间'"
                    @change="inputChange(item)"
                  ></el-input>
                  <el-date-picker
                    v-else-if="item.label == '学历起止时间' && http.indexOf('lyjc') != -1"
                    v-model="item.placeholder"
                    @change="inputChange(item, 'time')"
                    value-format="yyyy-MM-dd"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                  >
                  </el-date-picker>
                  <el-input
                    v-model="item.placeholder"
                    type="textarea"
                    v-else-if="item.field_type == 'textarea' && http.indexOf('lyjc') == -1"
                    @change="inputChange(item)"
                    :maxlength="item.label == '学习工作经历' ? 120 : 1000"
                    :show-word-limit="item.label == '学习工作经历'"
                    :rows="item.label == '学习工作经历' ? 5 : 2"
                  ></el-input>

                  <el-input
                    type="textarea"
                    v-model="item.placeholder"
                    v-else-if="item.field_type == 'textarea' && http.indexOf('lyjc') != -1 && formLabelAlign.gz != '特种作业'"
                    @change="inputChange(item)"
                  ></el-input>
                  <div v-else-if="item.label == '学习工作经历' && http.indexOf('lyjc') != -1 && formLabelAlign.gz == '特种作业'"
                    style="display:flex;align-items: center;"
                  >
                  <el-date-picker
                    v-model="item.placeholder"
                    value-format="yyyy-MM-dd"
                    type="date"
                    @change="inputChange(item, 'time')"
                    placeholder="选择开始日期">
                  </el-date-picker>
                    <p style="width:100px;font-size:14px;height:100%;display:flex;align-items: center;padding:0;"> 
                      - 至今
                    </p>
                  </div>
                  <!-- <el-date-picker
                    
                    v-model="item.placeholder"
                    @change="inputChange(item, 'time')"
                    value-format="yyyy-MM-dd"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    :unlink-panels='true'
                  >
                  </el-date-picker> -->
                  <el-input
                    type="textarea"
                    v-model="item.placeholder"
                    v-else-if="item.field_type == 'textarea' && http.indexOf('lyjc') != -1 && formLabelAlign.gz == '特种作业' && item.label != '学习工作经历'"
                    @change="inputChange(item)"
                  ></el-input>
                  <el-input v-model="item.placeholder" v-else-if="item.field_type == 'number'" type="number" @change="inputChange(item)"></el-input>
                  <el-radio-group v-model="item.placeholder" v-else-if="item.field_type == 'radio'" @change="inputChange(item)">
                    <el-radio :label="el.e" v-for="el in JSON.parse(item.options)" :key="el.e">{{ el.e }}</el-radio>
                  </el-radio-group>
                  <el-select
                    style="width: 100%"
                    @change="inputChange(item)"
                    v-model="item.placeholder"
                    placeholder="请选择"
                    v-else-if="item.field_type == 'select' && item.label != '培训科目' && item.field_id != 'region_id'"
                  >
                    <el-option v-for="item in JSON.parse(item.options)" :key="item.e" :label="item.label ? item.label : item.e" v-model="item.e"> </el-option>
                  </el-select>
                  <!-- <el-cascader 
                                    v-else-if="item.field_type=='select'&&item.label=='分级部门'"
                                    v-model="item.placeholder"
                                    class="filter-item" 
                                    placeholder="请选择分级部门" 
                                    clearable 
                                    :options="Departmentlist" 
                                    :props="{label:'title',value:'id',key:'id',checkStrictly: true}"
                                    @change="inputChange(item,'dep')"
                                ></el-cascader> -->
                  <el-cascader
                    v-else-if="item.field_id == 'region_id'"
                    v-model="item.placeholder"
                    class="filter-item"
                    placeholder="请选择工作地点"
                    clearable
                    :props="{
                      lazy: true,
                      lazyLoad: lazyLoad,
                      label: 'region_name',
                      value: 'region_id',
                      key: 'region_id',
                    }"
                    @change="inputChange(item, 'region_id')"
                  ></el-cascader>
                  
                  <!-- :limit='item.field_id=="dkaq"?formLabelAlign.gz=="特种作业"?2:1:1' -->
                  <div v-else-if="item.field_type == 'img'" style="display: flex; align-items: center">
                    <upload
                      action="/admin/MemberApply/upload"
                      accept="image/*"
                      :data="{ field: item.field_id }"
                      :fileList="item.fileList"
                      :plain="false"
                      @change="upChange($event, item.field_id)"
                      :sefelfs="sefelfs"
                      @remove="remove(item.field_id)"
                      @PictureCard="PictureCard(item, $event)"
                      :ref="'img' + item.field_id"
                      :limit="item.field_id == 'last_cert' ? 2 : 1"
                      :PictureEditBackIf="setting.backgroundPhoto&&setting.backgroundPhoto=='是'&&item.field_id=='photo'"
                      @PictureEditBack="PictureEditBack(item, $event)"
                    />
                    <span style="margin-left: 10px; cursor: pointer; color: blue; display: block" v-if="item.defImg"
                      ><span @click="openDefimg(item.defImg)">查看示例图片</span></span
                    >
                  </div>
                  <el-date-picker
                    v-else-if="item.field_type == 'datetime'"
                    v-model="item.placeholder"
                    type="date"
                    value-format="yyyy-MM-dd"
                    @change="inputChange(item)"
                    placeholder="选择日期"
                  >
                  </el-date-picker>
                  <div v-else-if="item.field_type == 'json'" v-show="item.isshow">
                    <el-form-item :label="it.label" v-for="(it, index) in JSON.parse(item.options)" :key="index" :required="Boolean(item.selected)">
                      <el-input v-model="JsonListFrom[it.label]" @change="inputChange(item, 'json')" v-if="it.field_type == 'input'"></el-input>
                      <el-date-picker
                        @change="inputChange(item, 'json')"
                        v-if="it.field_type == 'datetime'"
                        v-model="JsonListFrom[it.label]"
                        type="date"
                        value-format="yyyy-MM-dd"
                        placeholder="选择日期"
                      >
                      </el-date-picker>
                    </el-form-item>
                  </div>
                  <div v-else-if="item.field_type == 'autowrite' && http.indexOf('jingxin') == -1">
                    <div v-if="item.field_id == 'jkcns'">
                      <el-button type="primary" @click="writeName(item.field_id, 'DomImg' + item.field_id)" v-if="!autographPath1">签名</el-button>
                      <img v-else :src="autographPath1" alt="" style="width: 120px; height: 60px; cursor: pointer" @click="writeName(item.field_id, 'DomImg' + item.field_id)" />
                      <span style="margin-left: 50px; cursor: pointer; color: red" @click="openBook">阅读{{ item.label }}</span>
                    </div>
                    <div v-if="item.field_id == 'zjbl'">
                      <el-button type="primary" @click="writeName(item.field_id, 'DomImg' + item.field_id)" v-if="!autographPath2">签名</el-button>
                      <img v-else :src="autographPath2" alt="" style="width: 120px; height: 60px; cursor: pointer" @click="writeName(item.field_id, 'DomImg' + item.field_id)" />
                      <span style="margin-left: 10px; cursor: pointer; color: red" @click="openBookXY">阅读{{ item.label }}</span>
                    </div>
                  </div>
                  <div v-else-if="item.field_type == 'autowrite' && http.indexOf('jingxin') != -1">
                    <div v-if="item.field_id == 'jkcns'">
                      <upload
                        action="/admin/MemberApply/upload"
                        accept="image/*"
                        :data="{ field: item.field_id }"
                        :fileList="item.fileList"
                        :plain="false"
                        @change="upChange"
                        @remove="remove(item.field_id)"
                        @PictureCard="PictureCard(item, $event)"
                        :ref="'img' + item.field_id"
                        :showPictureCard="false"
                        value="签名图片"
                      />
                      <!-- jkcns -->
                      <span style="margin-left: 50px; cursor: pointer; color: red" @click="openBook">阅读{{ item.label }}</span>
                    </div>
                    <div v-if="item.field_id == 'zjbl'">
                      <upload
                        action="/admin/MemberApply/upload"
                        accept="image/*"
                        :data="{ field: item.field_id }"
                        :fileList="item.fileList"
                        :plain="false"
                        @change="upChange"
                        @remove="remove(item.field_id)"
                        @PictureCard="PictureCard(item, $event)"
                        :ref="'img' + item.field_id"
                        :showPictureCard="false"
                        value="签名图片"
                      />
                      <span style="margin-left: 10px; cursor: pointer; color: red" @click="openBookXY">阅读{{ item.label }}</span>
                    </div>
                  </div>
                </el-form-item>
                <el-form-item v-if="platformAnhui()|| http.indexOf('qiye') != -1" label="企业性质" required>
                  <el-select v-model="formLabelAlign.extra.企业性质" placeholder="请选择">
                    <el-option label="国企" value="国企"> </el-option>
                    <el-option label="私企" value="私企"> </el-option>
                    <el-option v-if="formLabelAlign.gz == '特种作业'" label="个人" value="个人"> </el-option>
                  </el-select>
                </el-form-item>
                <!--   -->
                <el-form-item label="燃气主管部门" required v-if="http.indexOf('bosheng') != -1&&formLabelAlign.gz=='燃气从业人员培训'">
                  <el-cascader
                    v-model="deptitle"
                    :options="depList"
                    class="filter-item"
                    placeholder="请选择部门"
                    clearable
                    :props="{
                      label:'title',
                      value:'id',
                    }"
                    @change="depchange"
                  ></el-cascader>
                </el-form-item>
                <el-form-item label="验证码" v-if="platform('hzdpx') || platform('xtaq') || (platform('zcaq') && formLabelAlign.gz == '大培训')">
                  <div style="display: flex; width: 100%">
                    <el-input style="flex: 1" v-model="codeChk"> </el-input>
                    <div style="height: 40px; display: flex; align-items: center; min-width: 70px; margin-left: 5px">
                      <el-button type="primary" style="height: 100%" @click="hoveCode" v-if="hascodeYes">获取验证码</el-button>
                      <div v-else style="height: 100%; width: 70px; border: 1px solid #eee; display: flex; align-items: center; justify-content: center; color: #000">
                        {{ codeTime }}s
                      </div>
                    </div>
                  </div>
                </el-form-item>
                <div v-for="item in fromList" :key="item.id + 100000">
                  <el-form-item v-if="item.field_id == 'edu_photo' && ((platform('lyky') && showBox) || platform('zkqc'))" label="学历承诺书" :required="Boolean(item.selected)">
                    <span style="color: red; line-height: 20px !important" v-if="!platform('zkqc')">学历承诺书与毕业证二选一</span>
                    <div>
                      <el-button type="primary" @click="writeName('edu_photo', 'DomImgXL')" v-if="!autographPath3">签名</el-button>
                      <img v-else :src="autographPath3" alt="" style="width: 100px; height: 60px; cursor: pointer" @click="writeName('edu_photo', 'DomImgXL')" />
                      <span style="margin-top: 10px; cursor: pointer; color: blue; display: block"><span @click="openBookXl">阅读学历承诺书</span></span>
                    </div>
                  </el-form-item>
                </div>
                <div v-if="showBox">
                  <!-- <el-form-item label="学历承诺书" v-if="platform('lyky')">
                                    <el-button type="primary" @click="downReader">下载</el-button>
                                </el-form-item> -->
                  <el-form-item label="健康查体表" v-if="platform('lyky')">
                    <upload
                      action="/admin/MemberApply/upload"
                      accept="image/*"
                      :data="{ field: 'jkcns' }"
                      :fileList="JkfileList.fileList"
                      :plain="false"
                      @change="upChange"
                      @remove="remove('jkcns')"
                      @PictureCard="PictureCard(JkfileList, $event)"
                      :ref="'imgjkcns'"
                    />
                    <el-button type="text" @click="downFuled">附件下载</el-button>
                  </el-form-item>
                </div>
                <div v-if="objinvoice[formLabelAlign.gz] == '开启'">
                  <el-form-item label="发票税号">
                    <el-input v-model="shuihao"></el-input>
                  </el-form-item>
                  <el-form-item label="发票户头">
                    <el-input v-model="hutou"></el-input>
                  </el-form-item>
                  <el-form-item label="发票截图">
                    <upload
                      action="/admin/MemberApply/upload"
                      accept="image/*"
                      :data="{ field: 'image' }"
                      :fileList="FpfileList.fileList"
                      :plain="false"
                      @change="upChange"
                      @remove="remove('image')"
                      @PictureCard="PictureCard(FpfileList, $event)"
                      :ref="'imgimage'"
                    />
                  </el-form-item>
                </div>
                <el-form-item label="注意事项" v-if="(platformAnhui() || platform('qiye')) && formLabelAlign.gz == '特种作业'">
                  <el-button type="primary" @click="writeName('注意事项', null)" v-if="!autographPath4">签名</el-button>
                  <img v-else :src="autographPath4" alt="" style="width: 120px; height: 60px; cursor: pointer" @click="writeName('注意事项', null)" />
                  <span style="margin-left: 50px; cursor: pointer; color: red" @click="openBookshixiang">阅读注意事项</span>
                </el-form-item>
                <el-form-item label="诚信声明" v-if="(platform('sjhg'))">
                  <el-button type="primary" @click="writeName('cxsm', null)" v-if="!autographPath5">签名</el-button>
                  <img v-else :src="autographPath5" alt="" style="width: 120px; height: 60px; cursor: pointer" @click="writeName('cxsm', null)" />
                  <span style="margin-left: 50px; cursor: pointer; color: red" @click="openBookalert('cxsm','诚信声明')">阅读诚信声明</span>
                </el-form-item>
                <el-form-item label="承诺事项" v-if="(platform('guangtai')&&formLabelAlign.gz == '特种作业')">
                  <el-button type="primary" @click="writeName('cnsx', null)" v-if="!autographPath6">签名</el-button>
                  <img v-else :src="autographPath6" alt="" style="width: 120px; height: 60px; cursor: pointer" @click="writeName('cnsx', null)" />
                  <span style="margin-left: 50px; cursor: pointer; color: red" @click="openBookalert('cnsx','承诺事项')">阅读承诺事项</span>
                </el-form-item>
                <el-form-item label="知情同意书" v-if="(platform('kaiqi')||platform('mingda'))&&formLabelAlign.gz == '特种作业'">
                  <el-button type="primary" @click="writeName('zqtys', null)" v-if="!autographPath7">签名</el-button>
                  <img v-else :src="autographPath7" alt="" style="width: 120px; height: 60px; cursor: pointer" @click="writeName('zqtys', null)" />
                  <span style="margin-left: 50px; cursor: pointer; color: red" @click="openBookalert('zqtys','知情同意书')">阅读知情同意书</span>
                </el-form-item>
                <el-form-item label="承诺项" v-if="init.district.includes('云南')&&formLabelAlign.gz == '特种作业'">
                  <el-button type="primary" @click="writeName('cnx', null)" v-if="!autographPath8">签名</el-button>
                  <img v-else :src="autographPath8" alt="" style="width: 120px; height: 60px; cursor: pointer" @click="writeName('cnx', null)" />
                  <span style="margin-left: 50px; cursor: pointer; color: red" @click="openBookalert('cnx','承诺项')">阅读承诺项</span>
                </el-form-item>
                <!-- <el-form-item label="报名表下载" v-if="(platformAnhui() || platform('qiye')) && formLabelAlign.gz == '特种作业'">
                  <el-button type="primary" @click="downloadImg2('报名表下载')" style="height: 100%">下载</el-button>
                </el-form-item> -->
                <el-form-item label="任命文书下载" v-if="(platformAnhui() || platform('qiye')) && (formLabelAlign.gz == '一般工贸' || formLabelAlign.gz == '安全管理')">
                  <el-button type="primary" @click="downloadImg2('任命文书下载')" style="height: 100%">下载</el-button>
                </el-form-item>
                <!-- <el-form-item label="登记表下载" v-if="(platform('xinhua')) && (formLabelAlign.gz == '安全管理')">
                  <el-button type="primary" @click="downloadImg2('登记表下载')" style="height: 100%">下载</el-button>
                </el-form-item> -->
              </div>
              <div v-else>
                <!-- 太化 -->
                <Taihua ref="taihua" :gz="formLabelAlign.gz" @formlist="commitA"></Taihua>
              </div>
            </el-form>
            <div style="margin-top: 10px">
              <div class="box_form_title">
                <el-button type="primary" @click="commit" v-if="http.indexOf('taihua') == -1 || (http.indexOf('taihua') != -1 && formLabelAlign.gz != '学历提升')">{{
                  platform("lyky") || platform("xtaq") || (platform("zcaq") && formLabelAlign.gz == "大培训") ? "提交并登录" : "提交"
                }}</el-button>
                <el-button type="primary" @click="commitA" v-else>提交</el-button>
                <!-- <el-button type="danger" @click="()=>{
                                    this.$refs.jf.open()
                                }">我已报名,去缴费</el-button> -->
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <simpleCrop :crop-params="cropParams" @crop="crop" v-if="isShowImgCard" @close="closeCallback">
    </simpleCrop>
    <el-dialog title="签名" :visible.sync="dialogShow" width="30%">
      <div style="width: 100%; display: flex; justify-content: center">
        <autograph ref="autograph"> </autograph>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button
          @click="
            () => {
              if (this.fileNameWirth == 'edu_photo') {
                this.autographPath3 = this.$refs.autograph.clear();
                this.formLabelAlign.edu_photo = '';
              } else if (this.fileNameWirth == 'jkcns') {
                this.autographPath1 = this.$refs.autograph.clear();
                this.formLabelAlign.jkcns = '';
              } else if (this.fileNameWirth == 'zjbl') {
                this.formLabelAlign.zjbl = '';
                this.autographPath2 = this.$refs.autograph.clear();
              } else if (this.fileNameWirth == '注意事项') {
                this.formLabelAlign.extra.注意事项 = '';
                this.autographPath4 = this.$refs.autograph.clear();
              }
              else if (this.fileNameWirth == 'cxsm') {
                this.formLabelAlign.extra.cxsm = '';
                this.autographPath5 = this.$refs.autograph.clear();
              }
              else if (this.fileNameWirth == 'cnsx') {
                this.formLabelAlign.extra.cnsx = '';
                this.autographPath6 = this.$refs.autograph.clear();
              }
              else if (this.fileNameWirth == 'zqtys') {
                this.formLabelAlign.extra.zqtys = '';
                this.autographPath7 = this.$refs.autograph.clear();
              }
              else if (this.fileNameWirth == 'cnx') {
                this.formLabelAlign.extra.cnx = '';
                this.autographPath8 = this.$refs.autograph.clear();
              }
              this.conse();
            }
          "
          >清 空</el-button
        >
        <el-button @click="dialogShow = false">取 消</el-button>
        <el-button type="primary" @click="submit">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
      <el-input v-model="str" type="textarea" placeholder="请输入内容" :autosize="{ minRows: 2 }" resize="none" :readonly="true"></el-input>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
      </span>
    </el-dialog>
    <div id="DomImgjkcns" class="DomImg">
      <div class="A4page">
        <h1>个人健康承诺</h1>
        <div style="margin-top: 80px">
          <p style="text-indent: 50px; font-family: '宋体'">
            本人姓名<u>{{ formLabelAlign.nickname }}</u
            >，身份证号码<u>{{ formLabelAlign.username }}</u
            >，现申请<u>{{ subjectTitle }}</u
            >（作业类别）特种作业操作证。本人身体健康，无妨碍从事相应特种作业的器质性心脏病、癫痫病、美尼尔氏症、眩晕症、癔病、震颤麻痹症、精神病、痴呆症以及其他疾病和生理缺陷。本人对以上信息的真实性负责，如有隐瞒，相关责任全部由本人承担。
          </p>
          <div style="width: 100%; display: flex; justify-content: flex-end; padding-right: 30px; margin-top: 150px">
            <span style="font-size: 16px">承诺人（签字）：</span>
            <img :src="autographPath" style="height: 30px" alt="" />
          </div>
          <div style="width: 100%; display: flex; justify-content: flex-end">
            <span style="font-size: 16px; padding: 0 16px">{{ new Date().getFullYear() }}年</span>
            <span style="font-size: 16px; padding: 0 16px">{{ new Date().getMonth() + 1 }}月</span>
            <span style="font-size: 16px; padding: 0 16px">{{ new Date().getDate() }}日</span>
          </div>
        </div>
      </div>
    </div>
    <div id="DomImgXL" class="DomImg">
      <div class="A4page">
        <h1>个人学历承诺</h1>
        <div style="margin-top: 80px">
          <p style="text-indent: 50px; font-family:'宋体'">
            本人姓名<u>{{ formLabelAlign.nickname }}</u
            >，身份证号码<u>{{ formLabelAlign.username }}</u
            >，现申请<u>{{ subjectTitle }}</u
            >（作业类别）特种作业操作证。本人身体健康，无妨碍从事相应特种作业的器质性心脏病、癫痫病、美尼尔氏症、眩晕症、癔病、震颤麻痹症、精神病、痴呆症以及其他疾病和生理缺陷。{{init.district.includes('云南')? '本人承诺：':''}}本人对以上信息的真实性负责，如有隐瞒，相关责任全部由本人承担。
          </p>
          <p style="text-indent: 50px; font-family:'宋体'" v-if="init.district.includes('云南')">特此承诺</p>
          <div style="width: 100%; display: flex; justify-content: flex-end; padding-right: 30px; margin-top: 150px">
            <span style="font-size: 30px">承诺人（签字）：</span>
            <img :src="autographPath1" style="height: 70px" alt="" />
          </div>
          <div style="width: 100%; display: flex; justify-content: flex-end; padding-right: 30px;" v-if="init.district.includes('云南')">
            <p style="font-size: 30px;min-width: 300px;">电话：{{ formLabelAlign.phone }}</p>
          </div>
          <div style="width: 100%; display: flex; justify-content: flex-end">
            <span style="font-size: 30px; padding: 0 30px">{{ new Date().getFullYear() }}年</span>
            <span style="font-size: 30px; padding: 0 30px">{{ new Date().getMonth() + 1 }}月</span>
            <span style="font-size: 30px; padding: 0 30px">{{ new Date().getDate() }}日</span>
          </div>
        </div>
      </div>
    </div>
    <div id="DomImgzjbl" class="DomImg">
      <div class="A4page">
        <h1>证件办理费用协议</h1>
        <div style="margin-top: 80px">
          <div>
            <p>甲方:{{ setting.gsName }}</p>
            <p>乙方:{{ formLabelAlign.nickname }}</p>
          </div>
          <div>
            <p>一、甲方依据相关规定收取乙方培训、考试、办理及发放证件等费用，并依法对乙方提供相关服务。</p>
            <p>二、乙方必须按甲方规定时间进行培训、考试及取证，因乙方个人原因及行为不能按时参加培训、考试及无法取证者，甲方不予退费。</p>
            <p>三、从报名开始，六个月之内必须考完，否则视为自动放弃。</p>
            <p>四、代办人员需将本协议告知学员本人。</p>
            <p>本人已阅读并同意上述协议内容。</p>
          </div>
          <div style="height: 300px; width: 460px" v-if="formLabelAlign.id_card_photo">
            <img style="width: 100%; height: 100%" crossOrigin="Anonymous" :src="formLabelAlign.id_card_photo + '?' + new Date().getTime()" alt="" />
          </div>
          <!--  v-if="formLabelAlign.id_card_emblem" -->
          <div style="height: 300px; width: 460px" v-if="formLabelAlign.id_card_emblem">
            <img style="width: 100%; height: 100%" crossOrigin="Anonymous" :src="formLabelAlign.id_card_emblem + '?' + new Date().getTime()" alt="" />
          </div>
          <div style="width: 100%; display: flex; justify-content: flex-end; padding-right: 30px; margin-top: 100px">
            <span style="font-size: 16px">承诺人（签字）：</span>
            <img :src="autographPath" v-if="autographPath" style="height: 30px" alt="" />
          </div>
          <div style="width: 100%; display: flex; justify-content: flex-end">
            <span style="font-size: 16px; padding: 0 16px">{{ new Date().getFullYear() }}年</span>
            <span style="font-size: 16px; padding: 0 16px">{{ new Date().getMonth() + 1 }}月</span>
            <span style="font-size: 16px; padding: 0 16px">{{ new Date().getDate() }}日</span>
          </div>
        </div>
      </div>
    </div>
    <jf ref="jf"></jf>
    <el-dialog title="编辑背景色" :visible.sync="showProBack" width="30%" v-loading="showProBackLoading">
      <div style="
      display: flex;
    flex-direction: column;
    align-items: center;">
        <img :src="backPhoto" alt="" style="height:350px;width:250px;">
        <div style="display: flex;" >
          <p style="margin: 10px 15px;background-color: #fff;height:40px;width:40px;display: flex;align-items: center;justify-content: center;border-radius: 50%;box-shadow: 0px 2px 6px 0 #aaa;cursor: pointer;" @click="checkBackGround('0')"></p>
          <p style="margin: 10px 15px;background-color: blue;height:40px;width:40px;display: flex;align-items: center;justify-content: center;border-radius: 50%;box-shadow: 0px 2px 6px 0 #aaa;cursor: pointer;" @click="checkBackGround('1')"></p>
          <p style="margin: 10px 15px;background-color: #f00;height:40px;width:40px;display: flex;align-items: center;justify-content: center;border-radius: 50%;box-shadow: 0px 2px 6px 0 #aaa;cursor: pointer;" @click="checkBackGround('2')"></p>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="commitEditPhtot">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { applyList, applyAdd, subjectList, regionList, H5Pay, H5PayList, maPay, qrcode, sendcode,axios,Department } from "@/api/apply.js";
import simpleCrop from "simple-crop/index.vue";
import "simple-crop/template-1.css";
import { mapGetters } from "vuex";
import { dataURLtoFile } from "@/utils/64batatoFile";
import autograph from "@/components/autograph";
import { upFile, upFileqm ,ImgUrltoFile} from "@/utils/upFiel.js";
import { download, downloadAll } from "@/api/download.js";
import jf from "./jf.vue";
import Taihua from "./components/taihua.vue";
import { setapplyid, getapplyid, delapplyid, setopenId, getopenId, delopenId, setstartInfo, delstartInfo, getstartInfo } from "@/utils/cookie.js";

export default {
  computed: {
    ...mapGetters(["init", "http"]),
  },
  components: {
    simpleCrop,
    autograph,
    jf,
    Taihua,
  },
  data() {
    return {
      depList:[],
      deptitle:'',
      fromList: [],
      formLabelAlign: {
        gz: "",

        extra: { address: "", CNPtype: "", 企业性质: "", 注意事项: "" },
      },
      codeChk: "",
      GZList: [],
      qyname: "",
      qylogo: "",
      loading: false,
      fileList: [],
      subjectListTree: [],
      subjectlist: [],
      companytype: "",
      Arrpass: [], //
      titleA: "初培",
      itemA: {}, //当前科目信息
      JsonListFrom: {},
      cropParams: {
        title: "编辑图片(可以拖动边框改变截取图片大小)", //标题
        src: "", // 裁剪图片地址
        size: {
          // 裁剪尺寸
          width: 390,
          height: 567,
        },
        rotateSlider: true, //是否开启旋转刻度盘
        cropSizePercent: 0.65, //裁剪框显示比例
        borderWidth: 1, //裁剪框边框宽度
        funcBtns: ["close", "crop",'around', 'reset'], //功能按钮配置
        borderColor: "#fff", //裁剪框边框颜色
        coverColor: "rgba(0,0,0,.5)", //裁剪框遮罩颜色
        startAngle: -360, //旋转刻度盘开始角度
        endAngle: 360, //旋转刻度盘结束角度
      },
      showProBack:false,//图片背景色修改弹框
      showProBackLoading:false,//图片背景色修改弹框
      backPhoto:'',//修改之后的url
      backPhotoFile:'',//修改之后的file类型文件
      isShowImgCard: false,
      dialogShow: false,
      autographPath: "", //签名图片地址 清空或无写入为false
      autographPath1: "", //签名图片地址 清空或无写入为false
      autographPath2: "", //签名图片地址 清空或无写入为false
      autographPath3: "", //签名图片地址 清空或无写入为false
      autographPath4: "", //签名图片地址 清空或无写入为false
      autographPath5: "", //签名图片地址 清空或无写入为false
      autographPath6: "", //签名图片地址 清空或无写入为false
      autographPath7: "", //签名图片地址 清空或无写入为false
      autographPath8: "", //签名图片地址 清空或无写入为false
      dialogVisible: false,
      str: "",
      setting: {},
      Domsrc: "", //签名图片
      DomImgShow: false, //健康承诺书
      subjectTitle: "",
      subjectTitleList: [],
      objinvoice: {}, //发票信息
      hutou: "", //发票户头
      shuihao: "", //发票税号
      FpfileList: { fileList: [], field_id: "image" }, //发票图片表
      JkfileList: { fileList: [], field_id: "jkcns" }, //发票图片表
      showBox: false, //特种设备展示模块
      fileNameWirth: "",
      DOMID: "",
      hascodeYes: true,
      codeTime: 60,
      timeObj: Object,
      typeList: ["一般工贸", "普货运输", "危货运输", "汽车维修", "驾驶培训", "危化品"],
      addressList: ["禹会", "蚌山", "龙子湖", "经开", "高新", "淮上", "怀远", "固镇", "五河"],
      sefelfs: "1", //文件自动上传
      arrlist: [],
      
    };
  },
  watch: {
    // 'cropParams.size':{
    //   deep:true,
    //   handler:function (val){
    //     console.log(val,'7777');
    //     this.closeCallback()
    //     setTimeout(()=>{
    //       this.isShowImgCard=true
    //     },1000)
    //   }
    // }
    
  },
  created() {
    // this.init()
    if (this.$route.query.adminid) {
      this.admin_user_id = this.$route.query.adminid;
      this.depid = this.$route.query.depid;
      this.dep = this.$route.query.dep;
      setstartInfo(
        JSON.stringify({
          admin_user_id: this.$route.query.adminid,
          depid: this.$route.query.depid,
          dep: this.$route.query.dep,
        })
      );
    } else {
      this.admin_user_id = "";
      this.depid = "";
      this.dep = "";
      if(this.platformAnhui()){
        setstartInfo(
          JSON.stringify({
            admin_user_id: "1106",
            depid: 1,
            dep:1,
          })
        );
        this.admin_user_id = "1106";
        this.depid = "1";
        this.dep = "1";
      }else{
        delstartInfo()
      }
    }
    this.GZList = this.init.selected_gz.split(",");
    if (this.platform("xtaq")) {
      //大类里面只留下大培训
      this.GZList = ["大培训"];
    }
    if (this.platform("yali")) {
      this.GZList.map((item, index) => {
        if (item == "一般工贸") {
          this.GZList[index] = "一般行业";
        }
        if (item == "安全管理") {
          this.GZList[index] = "危化品";
        }
      });
    }
    if (this.platform("dkaq")) {
      this.GZList.map((item, index) => {
        if (item == "安全管理") {
          this.GZList[index] = "高危安管";
        }
      });
    }
    this.setting = JSON.parse(this.init.setting);
    if (this.$route.query.name) {
      this.formLabelAlign.gz = this.$route.query.name;
    } else {
      this.formLabelAlign.gz = this.GZList[0];
    }
    this.qyname = this.init.alias;
    this.qylogo = this.init.qylogo;
    this.applyListData(this.formLabelAlign.gz);
    this.subject(this.formLabelAlign.gz);
    if (this.setting.invoice) {
      this.objinvoice = JSON.parse(this.setting.invoice);
    }
    if (this.setting.bmSerm) {
      this.str = JSON.parse(JSON.stringify(this.setting.bmSerm));
      // let num = 1
      // for(let item of setting.bmSerm){
      //     if(item ==' '){
      //         num++
      //         console.log(num)
      //         this.str = this.str.slice(0,this.str.indexOf(item)) + '<br/>'+this.str.slice(this.str.indexOf(item)+1)
      //         console.log(this.str,'12111')
      //     }
      // }
      this.dialogVisible = true;
    } else {
      this.str = "";
    }
    if (this.formLabelAlign.gz == "特种设备") {
      this.showBox = true;
    } else {
      this.showBox = false;
    }
    if(this.http.indexOf('bosheng')!=-1&&this.formLabelAlign.gz=='燃气从业人员培训'){
      Department().then(res=>{
        this.depList=res.data
      })
    }
  },
  methods: {
    conse() {
      this.formLabelAlign[this.fileNameWirth] = "";
      this.formLabelAlign.signature = this.formLabelAlign[this.fileNameWirth];
      this.autographPath = this.formLabelAlign.signature;
      // if(this.fileNameWirth=='edu_photo'){
      //     this.formLabelAlign.edu_photo=''
      // }else if(this.fileNameWirth=='jkcns'){
      //     this.formLabelAlign.jkcns=''
      // }else if(this.fileNameWirth=='zjbl'){
      //     this.formLabelAlign.zjbl=''
      // }
    },
    //获取验证码
    hoveCode() {
      if (!this.formLabelAlign.phone) {
        return this.$message.error("手机号不能为空");
      }
      this.codeTime = 60;
      this.hascodeYes = false;
      clearInterval(this.timeObj);
      sendcode({
        mobile: this.formLabelAlign.phone,
      }).then((res) => {
        if (res.code == 200) {
          this.$message.success("验证码发送成功");
          this.timeObj = setInterval(() => {
            if (this.codeTime <= 0) {
              this.hascodeYes = true;
              clearInterval(this.timeObj);
            }
            this.codeTime--;
          }, 1000);
        }
      });
    },
    applyListData(gz) {
      this.loading = true;
      applyList({ gz, usage: "apply" }).then((res) => {
        this.loading = false;
        if (res.code == 200) {
          this.fromList = res.data.filter((item) => item.label != "工种").filter((item) => item.label != "初复审");

          this.fromList.map((item) => {
            if (this.formLabelAlign.gz == "一般工贸" && item.label == "职称" && this.platform("saite")) {
              item.options = '[{"e":"高级"},{"e":"中级"},{"e":"初级"},{"e":"无"}]';
            }
            if(this.platformAnhui()){
              if(item.field_id=='photo'){
                item.label='大头照'
              }
            }
          });
          JSON.parse(JSON.stringify(this.fromList))
            .filter((item) => item.field_id == "json")
            .map((item) => {
              JSON.parse(item.options).map((it) => {
                this.JsonListFrom[it.label];
              });
            });
          res.data.map((item) => {
            item.isshow = true;
            if (item.field_id != "gz") {
              this.formLabelAlign[item.field_id] = item.placeholder;
            }
            if (gz == "特种作业") {
              if (item.label == "现持证书信息") {
                item.isshow = false;
              }
            }
            if (gz == "一般工贸") {
              if (item.label == "安全合格证证号" || item.label == "截止日期") {
                item.isshow = false;
              }
            }
            if(gz == '职业卫生'){
              if(this.platform('ataq')){
                if(item.field_id=='training_record'){
                  item.isshow = false;
                }
              }
            }
            // if(gz=='特种作业'&&item.label=='安全生产管理人员安全合格证证号'){
            //     item.isshow = false
            // }
            // if(gz=='特种作业'&&item.label=='安全生产管理人员安全合格证证号'){
            //     item.isshow = false
            // }
          });
          this.Arrpass = res.data;
        }
      });
    },
    //切换工种
    gzChange(value) {
      this.titleA = "初培";
      let str = value;
      this.fromList = [];
      if (this.platform("yali")) {
        if (str == "一般行业") {
          str = "一般工贸";
        }
        if (str == "危化品") {
          str = "安全管理";
        }
      }
      if (this.platform("dkaq")) {
        if (str == "高危安管") {
          str = "安全管理";
        }
      }
      if (this.http.indexOf("taihua") != -1) {
        if (value != "学历提升") {
          this.applyListData(str);
        }
      } else {
        this.applyListData(str);
      }
      this.subject(str);
      if (str == "特种设备") {
        this.showBox = true;
      } else {
        this.showBox = false;
      }
    },
    //init
    // async init(){
    //    await applyInit().then( res=>{
    //         if(res.code==200){
    //             console.log(res)
    //             this.GZList=res.data.selected_gz.split(',')
    //             this.qyname=res.data.alias
    //             this.formLabelAlign.gz=this.GZList[0]
    //             this.applyListData(this.GZList[0])
    //             this.subject(this.GZList[0])
    //         }
    //     })
    // },
    //科目
    subject(gz) {
      subjectList(gz).then((res) => {
        this.subjectListTree = res;
        if (this.platform("xtaq") || this.platform("zcaq")) {
          this.subjectListTree = res.filter((item) => {
            return item.id == 794;
          });
        }
        if(this.platform('hshd')&&(gz=='特种作业'||gz=='安全管理')){
          var lop = function (list=[]) {
            for (let index = 0; index < list.length; index++) {
              const item = list[index];
              if(item.title=='初培'){
                // item.disabled=true
                list.splice(index,1)
              }else{
                lop(item.children)
              }
            }
          }
          lop(this.subjectListTree)
        }
        if (this.platform("xinhua")&&gz=='安全管理') {
          this.subjectListTree = res.filter((item) => {
            return item.title == '烟花爆竹生产单位' || item.title == '烟花爆竹经营单位';
          });
        }
      });
    },
    //科目切换
    subChange(value) {
      this.formLabelAlign.subject_id = value[value.length - 1];
      this.formLabelAlign.subject_ids = value.join(",");
      this.subjectTitleList=[]
      this.deep(this.subjectListTree, this.formLabelAlign.subject_id);
      console.log(value);
      this.deep3(this.subjectListTree, value);

      this.deep2(this.subjectListTree, value[0]);

      if (this.subjectlist.length != 0) {
        if (this.titleA == "初培" || this.titleA == "复审") {
          this.formLabelAlign.exam_type = this.titleA;
        } else {
          this.formLabelAlign.exam_type = "初培";
        }
      }
      let gz = this.formLabelAlign.gz;
      this.Arrpass.map((item) => {
        item.isshow = true;
      });
      this.Arrpass.map((item) => {
        if (gz == "特种作业") {
          if (this.platformAnhui()) {
            if (item.field_id == "last_cert") {
              if (this.titleA.indexOf("初培") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
            if (item.field_id == "qzsj") {
              if (this.titleA.indexOf("初培") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
          } else {
            if (item.label == "现持证书信息") {
              if (this.titleA.indexOf("初培") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
            if (item.label == "户口本" || item.label == "毕业证") {
              if (this.titleA.indexOf("复审") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
          }
        }
        if (gz == "一般工贸") {
          if (this.platformAnhui()) {
            if (item.field_id == "last_cert") {
              if (this.titleA.indexOf("初培") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
            if (item.field_id == "qzsj") {
              if (this.titleA.indexOf("初培") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
          } else {
            if (item.label == "安全合格证证号" || item.label == "截止日期") {
              if (this.titleA.indexOf("初培") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
          }
        }
        if (gz == "安全管理"|| gz=='高危安管') {
          if (this.platformAnhui()) {
            if (item.field_id == "last_cert") {
              if (this.titleA.indexOf("初培") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
            if (item.field_id == "zhicheng"){
              if(this.subjectTitle.indexOf('危险化学品生产单位')!=-1){
                item.isshow = true;
              }else{
                item.isshow = false;
              }
            }
            if (item.field_id == "edu_photo"){
              if(this.subjectTitle.indexOf('危险化学品生产单位')!=-1){
                item.hint = '毕业证和职称证选一个进行上传，须化工专业大专或中级职称以上证书';
              }else{
                item.hint = '毕业证和户口本选一个进行上传';
              }
            }
          }
          if (item.field_id == "qzsj") {
              if (this.titleA.indexOf("初培") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
        }
        if(gz == '职业卫生'){
          if(this.platform('ataq')){
            if(item.field_id=='training_record'){
              if (this.titleA.indexOf("初培") != -1) {
                item.isshow = false;
              } else {
                item.isshow = true;
              }
            }
          }
        }
        if(this.platform('yuhua')){
          if (item.field_id == "edu_photo") {
            if (this.titleA.indexOf("复审") != -1) {
              item.isshow = false;
            } else {
              item.isshow = true;
            }
          }
        }
      });
      this.$forceUpdate();
    },
    //递归
    deep(subjectListTree = [], id) {
      for (let i = 0; i < subjectListTree.length; i++) {
        let item = subjectListTree[i];
        
        if (item.id == id) {
          this.titleA = item.title;
          this.itemA = item;
          break;
        } else if (item.children) {
          this.deep(item.children, id);
        }
      }
    },
    //递归2
    deep2(subjectListTree = [], id) {
      for (let i = 0; i < subjectListTree.length; i++) {
        let item = subjectListTree[i];
        if (item.id == id) {
          this.subjectTitle = item.title;
          break;
        } else if (item.children) {
          this.deep2(item.children, id);
        }
      }
    },
    //递归3
    deep3(subjectListTree = [], id) {
      for (let i = 0; i < subjectListTree.length; i++) {
        let item = subjectListTree[i];
        if (id.includes(item.id)) {
          this.subjectTitleList.push(item.title)
          if (item.children) {
            this.deep3(item.children, id);
          }else{
            break
          }
        }else{
          break
        }
      }
    },
    depchange(val){
      
      this.formLabelAlign['dep'] = val[val.length-1];
      this.formLabelAlign['depid'] = val[val.length-1];
    },
    //科目初复审校验
    // subjectitem(value){
    //     switch(this.formLabelAlign.gz){
    //         case '特种作业':
    //             return value=='初培'?true:false;
    //         case '安全管理':
    //             return value=='初培'?true:false;
    //     }
    // },
    //input输入框 改变时触发
    inputChange(data, txt) {
      this.formLabelAlign[data.field_id] = data.placeholder;
      // if(txt=="dep"){
      //     this.formLabelAlign[data.field_id] = data.placeholder.join(',')
      // }
      if (txt == "region_id") {
        this.formLabelAlign[data.field_id] = data.placeholder.join(",");
      }
      if (txt == "json") {
        this.formLabelAlign[data.field_id] = JSON.stringify(this.JsonListFrom);
      }
      if (txt == "time") {
        if(data.field_id=='history'){
          this.formLabelAlign[data.field_id] = JSON.stringify([data.placeholder,'至今']);
        }else{
          this.formLabelAlign[data.field_id] = JSON.stringify(data.placeholder);
        }
      }
    },
    //剪辑图片
    crop(data) {
      
      this.isShowImgCard = false;
      this.asrsc = data.toDataURL();
      let file = dataURLtoFile(data.toDataURL());
      this.pearit.fileList = [
        {
          url: data.toDataURL(),
          name: "",
        },
      ];
      let srt = "img" + this.pearit.field_id;
      if (this.$refs[srt][0]) {
        this.$refs[srt][0].uploadImg(file);
      } else {
        this.$refs[srt].uploadImg(file);
      }
      // console.log()
    },
    //关闭剪辑
    closeCallback() {
      this.isShowImgCard = false;
      let name = document.getElementsByClassName('crop-whole-cover')
      for(const key in name){
        if(Number(key)||key==0){
          let item = name[key]
          document.getElementsByClassName('crop-whole-cover')[0].parentNode.removeChild(item)
        }
      }
    },
    //图片编辑
    PictureCard(item, file) {
      this.pearit = item;
      this.isShowImgCard = true;
      this.$nextTick(()=>{  //size
        this.cropParams.size.width =  document.getElementsByClassName('crop-mask')[0].getElementsByTagName('canvas')[0].width
        this.cropParams.size.height =  document.getElementsByClassName('crop-mask')[0].getElementsByTagName('canvas')[0].height
        this.$forceUpdate()
      })
        this.cropParams.src = file.url;
    },
    //图片背景色更改
    PictureEditBack(item, file){
      console.log(this.formLabelAlign,item,'7777');
      this.showProBack=true
      this.backPhoto=file.url
      return
    },
    //修改背景图片
    checkBackGround(col){
      console.log(this.formLabelAlign);
      this.showProBackLoading=true
      axios(
        '/taof',
        'get',
        {
          url:this.formLabelAlign.photo,
          col
        }
      ).then(res=>{
        this.showProBackLoading=false
        if(res.data.code==200){
          this.backPhoto = res.data.url
          let url = res.data.url
          // if(process.env.NODE_ENV === 'development'){
          //   url = '/urlapi'+res.data.url.split('https://cache.wer.plus')[1]
          // }else{
          //   url = res.data.url
          // }
          fetch(url,{
            mode:'no-cors'
          })
          .then((res) => {
              return res.blob();
          }).then(blob=>{
            this.backPhotoFile = new File([blob], 'photo.png', { type: "image/jpeg" });
          }).catch(err=>{
            console.log(err,'2222');
          })
        }else{
          this.$message.error(res.data.msg)
        }
      })
    },
    commitEditPhtot(){
      this.showProBack = false
      if (this.$refs['imgphoto'][0]) {
        this.$refs['imgphoto'][0].uploadImg(this.backPhotoFile);
      } else {
        this.$refs['imgphoto'].uploadImg(this.backPhotoFile);
      }
      this.fromList.map(item=>{
        if(item.field_id=='photo'){
          item.fileList=[
            {
              url: this.backPhoto,
              name: "",
            },
          ]
        }
      })
    },
    //上传照片时 触发
    upChange(file, label) {
      // console.log(file,fileList,label,'678');
      if (label == "photo" && file.size > 102400 && this.http.indexOf("暂无企业") != -1) {
        // 证件照小于100k
        this.sefelfs = label;
        this.$refs["img" + label][0].handleRemove();
        this.$message.error("上传照片不能大于100K!");
      } else {
        if (file.status == "ready") {
          this.arrlist = [];
          this.$refs["img" + label][0].commitUpload();
        }
      }
      if (file.status == "success" && file.response.code == 200) {
        if (label == "last_cert") {
          this.arrlist.push(file.response.data.url);
          this.formLabelAlign.last_cert = JSON.stringify(this.arrlist);
        } else {
          this.formLabelAlign[file.response.data.field] = file.response.data.url;
        }
        this.$message.success(file.response.msg);
        if (file.response.data.field == "hukou_photo") {
          this.Arrpass.map((item) => {
            if (item.field_id == "edu_photo") {
              item.selected = 0;
            }
          });
        } else {
          this.Arrpass.map((item) => {
            if (item.field_id == "edu_photo") {
              item.selected = 1;
            }
          });
        }
        if (file.response.data.field == "edu_photo") {
          this.Arrpass.map((item) => {
            if (item.field_id == "hukou_photo") {
              item.selected = 0;
            }
          });
        } else {
          this.Arrpass.map((item) => {
            if (item.field_id == "hukou_photo") {
              item.selected = 1;
            }
          });
        }
        //autographPath1
        // if(file.response.data.field=='jkcns'){
        //     this.autographPath1=file.response.data.url
        // }
      } else if (file.status == "success" && file.response.code != 200) {
        this.$message.error(file.response.msg);
      }
    },
    //删除照片时 触发
    remove(id) {
      this.formLabelAlign[id] = "";
    },
    //提交
    commit() {
      // window.open(this.http+'/user/#/login?username='+this.formLabelAlign.username,'_self')

      let formLabelAlign = JSON.parse(JSON.stringify(this.formLabelAlign));
      console.log(formLabelAlign);
      // return
      if (this.platform("yali")) {
        if (formLabelAlign.gz == "一般行业") {
          formLabelAlign.gz = "一般工贸";
        }
        if (formLabelAlign.gz == "危化品") {
          formLabelAlign.gz = "安全管理";
        }
      }
      if (this.platform("dkaq")) {
        if (formLabelAlign.gz == "高危安管") {
          formLabelAlign.gz = "安全管理";
        }
      }
      if (this.http.indexOf("bbxdf") != -1 || this.http.indexOf("testtjy") != -1) {
        if (formLabelAlign.extra.address == "") {
         return this.$message.warning("所在地区不能为空");
        } 
      }
      if(this.platformAnhui()&&!formLabelAlign.extra.企业性质){
        return this.$message.error("请选择企业性质");
      }
      if(this.platformAnhui()&&!formLabelAlign.extra.注意事项&&formLabelAlign.gz=='特种作业'){
        return this.$message.error("注意事项请签名");
      }
      formLabelAlign.extra = JSON.stringify(formLabelAlign.extra);
      if (this.hutou) {
        formLabelAlign.hutou = this.hutou;
      }
      if (this.shuihao) {
        formLabelAlign.shuihao = this.shuihao;
      }
      if (this.codeChk) {
        formLabelAlign.codeChk = this.codeChk;
      }
      let IDCard = /^[1-9]\d{5}(17|18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9X]$/; //身份证号校验
      let phone = /^1[3456789]\d{9}$/; //手机号校验
      for (let i = 0; i < this.Arrpass.length; i++) {
        let items = this.Arrpass[i];
        if (items.field_id == "exam_type") {
          continue;
        }
        if (Boolean(items.selected) && !formLabelAlign[items.field_id] && items.isshow && items.field_id != "cert") {
          this.$message.warning(items.label + "不能为空");
          return;
        }
        if (Boolean(items.selected) && items.field_id == "cert" && items.isshow) {
          let obj = JSON.parse(formLabelAlign[items.field_id]);
          if (formLabelAlign[items.field_id] == "[]") {
            this.$message.warning(items.label + "不能为空");
            return;
          }
          let list = JSON.parse(items.options);
          for (let j = 0; j < list.length; j++) {
            if (!obj[list[j].label]) {
              this.$message.warning(list[j].label + "不能为空");
              return;
            }
          }
        }
        if (items.field_id == "username" && Boolean(items.selected) && !IDCard.test(formLabelAlign.username)) {
          this.$message.warning("身份证不合法");
          return;
        }
        if (items.field_id == "phone" && Boolean(items.selected) && !phone.test(formLabelAlign.phone)) {
          this.$message.warning("手机号码不合法");
          return;
        }
      }
      if ((this.platform("hzdpx") || this.platform("xtaq") || (this.platform("zcaq") && formLabelAlign.gz == "大培训")) && !formLabelAlign.codeChk) {
        return this.$message.error("请输入验证码");
      }
      if(this.platformAnhui()){
        const obj = getstartInfo() ? JSON.parse(getstartInfo()) : {};
        formLabelAlign.admin_user_id = obj.admin_user_id ? obj.admin_user_id : "";
        formLabelAlign.depid = obj.depid ? obj.depid : "";
        formLabelAlign.dep = obj.dep ? obj.dep : "";
      }
      if(this.platform('bosheng')&&formLabelAlign.gz=='燃气从业人员培训'){
        if(!formLabelAlign.dep){
          return this.$message.error("请选择部门");
        }
      }
      // return
      this.loading = true;
      applyAdd(formLabelAlign).then((res) => {
        this.loading = false;
        if (res.code == 200) {
          // this.$message.success(res.msg)
          // this.$confirm('报名成功，管理员审核成功后即可开通培训权限','提示',{
          //     confirmButtonText: '确定',
          //     cancelButtonText: '取消',
          //     type: 'success',
          //     showClose:false,
          // }).then(()=>{
          //     this.$router.push('/')
          // }).catch(()=>{})
          // console.log(this.setting)
          if (this.setting.PCwxpay == "是") {
            // 判断是否有在线缴费的权限
            if (Number(this.itemA.price)) {
              //判断该科目是否是在线缴费
              let obj = { applyid: res.data.applyid };
              if (this.http.indexOf("yzza") != -1) {
                obj = { applyid: res.data.applyid, order_type: "报名" };
              }
              maPay(obj).then((res) => {
                if (res.return_msg == "OK") {
                  qrcode({ str: res.code_url }).then((resA) => {
                    if (resA.code == 200) {
                      this.$confirm(`<img src='${resA.data.url}' />`, "请使用微信扫码交费，交费成功后即可开通培训权限进行学习", {
                        dangerouslyUseHTMLString: true,
                        center: true,
                        confirmButtonText: "我已缴费",
                        beforeClose: (action, instance, done) => {
                          if (action == "confirm") {
                            H5PayList(obj).then((resB) => {
                              if (resB.code == 200) {
                                if (resB.data != "支付成功") {
                                  this.$message.error(resB.data + ",请联系管理员");
                                } else {
                                  this.$message.success("支付成功,2秒后自动跳转至登录页面");
                                  setTimeout(() => {
                                    window.open(this.http + "/user", "_self");
                                  }, 2000);
                                  done();
                                }
                              } else {
                                Message.error(resB.msg);
                              }
                            });
                          } else {
                            done();
                          }
                        },
                      });
                      // window.open(resA.data.url)
                    }
                  });
                }
              });
              // this.$confirm('请点击下方培训交费按钮进行交费，交费成功后即可开通培训权限进行学习','提示',{
              //     confirmButtonText: '培训缴费',
              //     cancelButtonText: '取消',
              //     type: 'success',
              //     showClose:false,
              //     // beforeClose: (action, instance, done) => {
              //     //     if (action == 'confirm') {
              //     //         H5PayList({applyid:res.data.applyid}).then(resA=>{
              //     //             if(resA.code == 200){
              //     //                 if(resA.data!='支付成功'){
              //     //                     H5Pay({applyid:res.data.applyid}).then(resB=>{
              //     //                         if(resB.code==200){
              //     //                             window.open(resB.data)
              //     //                             done();
              //     //                         }else{
              //     //                             this.$message.error(resB.msg)
              //     //                             done();
              //     //                         }
              //     //                     })
              //     //                 }else{
              //     //                     this.$message.success('支付成功，正在跳转')
              //     //                     done();
              //     //                 }
              //     //             }else{
              //     //                 this.$message.error(resA.msg)
              //     //                 done();
              //     //             }
              //     //         })

              //     //         // H5Pay({applyid:res.data.applyid}).then(resA=>{
              //     //         //     done();
              //     //         //     console.log(resA)
              //     //         //     if(res.code==200){

              //     //         //     }
              //     //         // })
              //     //     } else {
              //     //         done();
              //     //     }
              //     // }
              // }).then(()=>{

              // }).catch(()=>{})
            } else {
              this.$confirm("报名成功，管理员审核成功后即可开通培训权限", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "success",
                showClose: false,
              })
                .then(() => {
                  this.$router.push("/");
                })
                .catch(() => {});
            }
          } else {
            this.$confirm(
              this.platform("hzdpx") || this.platform("xtaq") || (this.platform("zcaq") && formLabelAlign.gz == "大培训")
                ? "报名成功"
                : "报名成功，管理员审核成功后即可开通培训权限",
              "提示",
              {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "success",
                showClose: false,
              }
            )
              .then(() => {
                if (this.platform("hzdpx") || this.platform("xtaq") || (this.platform("zcaq") && formLabelAlign.gz == "大培训")) {
                  window.open(this.http + "/user/#/login?username=" + formLabelAlign.username, "_self");
                } else {
                  this.$router.push("/");
                }
              })
              .catch(() => {});
          }
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    lazyLoad(node, resolve) {
      let id = node.data ? node.data.region_id : 0;
      regionList({ region_pid: id }).then((res) => {
        resolve(res.data.list);
      });
    },
    //
    downloadImg2(name) {
      if(this.platformAnhui()&&this.platformAnhui().length!=0){
        this.platformAnhui().forEach(item=>{
          if(item.gz.includes(this.formLabelAlign.gz)&&item.name==name){
            downloadAll(item.filePath, item.name);
          }
        })
      }
      if(this.platform('xinhua')){
        window.open("https://xinhua.taijieyun.com/storage/userimage/xinhua/20221227/0aeedb419f2afbb56415242c6dfd8505.docx");
      }
      // if (this.formLabelAlign.gz == "特种作业") {
      //   downloadAll("https://dkaq.taijieyun.com/storage/userimage/dkaq/20221114/983a84f2eeccb07ac44bfdea89ee2571.doc", "特种作业操作证考核申请表");
      // }
      // if (this.formLabelAlign.gz == "一般工贸" || this.formLabelAlign.gz == "安全管理") {
      //   downloadAll("https://dkaq.taijieyun.com/storage/userimage/dkaq/20221114/6182ba9e60c9500b76c52c3f42fca0d9.doc", "安全员登记表");
      // }
    },
    downloadImg3() {
      if (this.formLabelAlign.gz == "一般工贸" || this.formLabelAlign.gz == "高危安管") {
        downloadAll("https://dkaq.taijieyun.com/storage/userimage/dkaq/20221114/fdf8c2f000a3becdbf5ca52495aa44dd.docx", "安全员登记表");
      }
    },
    //打开签名
    writeName(name, id) {
      if (name == "jkcns") {
        if (!this.formLabelAlign.nickname) {
          return this.$message.error("姓名不能为空");
        }
        if (!this.formLabelAlign.username) {
          return this.$message.error("身份证号不能为空");
        }
        if (!this.subjectTitle) {
          // console.log(this.subjectTitle, "77");
          return this.$message.error("请选择培训科目后再签名");
        }
      }
      this.fileNameWirth = name;
      this.DOMID = id;
      this.dialogShow = true;
      this.$refs.autograph.clear()
    },
    //打开承诺书
    openBook() {
      //  this.DomImgShow=true
      this.$alert(
        "本人身体健康，无妨碍从事相应特种作业的器质性心脏病、癫痫病、美尼尔氏症、眩晕症、癔病、震颤麻痹症、精神病、痴呆症以及其他疾病和生理缺陷。本人对以上信息的真实性负责，如有隐瞒，相关责任全部由本人承担。",
        "健康承诺",
        {
          confirmButtonText: "确定",
        }
      );
    },
    //注意事项
    openBookshixiang() {
      //  this.DomImgShow=true
      this.$alert(
        "视频学习卡激活后，一律不退费！考试二次机会，二次不通过，重新报名，有效期一年！报考人员必须完成培训大纲学时，理论线上培训，实操线下培训，如果出现缺课，签到漏签，代签情况，不安排考试！培训结束后，学员自行缴纳考试费，因延误交款影响考试，不安排考试学员自行承担后果！本人已经认真阅读培训大纲和考核标准。",
        "注意事项",
        {
          confirmButtonText: "确定",
        }
      );
    },
    //通用弹出提醒
    openBookalert(text,title) {
      const h = this.$createElement;
      //  this.DomImgShow=true  formLabelAlign
      if(!this.subjectTitle&&text=='cxsm'){
        return this.$message.error("请选择培训科目不能为空");
      }
      var msg = ''
      if(text=='cxsm'){
        msg = `本人符合(${this.formLabelAlign.gz=='特种作业'?'特种作业人员':this.subjectTitleList[0]})安全生产知识和管理能力考核合格证考试条件，在表中填写的个人信息和提供的身份证明等内容是真实的(本人提供的身份证明等内容由培训机构留存)`
      }
      if(text=='cnsx'){
        msg = `1.本人身体健康，无妨碍从事相应特种作业的器质性心脏病、癫痫病、美尼尔氏症、
                眩晕症、癔病、震颤麻痹症、精神病、痴呆症以及其他疾病和生理缺陷；2.以上所填写的
                本人信息及提供的身份证复印件、学历证书复印件等材料真实有效；3.本人按《特种作业
                人员安全技术培训考核管理规定》（国家安全监管总局令第30号）有关规定参加相应的
                安全技术理论培训和实际操作培训4.以上个人信息和承诺事项以及提供的有关材料，如
                有弄虚作假或欺骗等行为，自愿被依法撤销《中华人民共和国特种作业操作证》，3年内
                不再申请办证。`
      }
      if(text=='cnx'){
        msg = `本人承诺，以上填写的个人信息和提供的身份证复印件、学历证书复印件及个人健康承诺书内容真实。`
      }
      if(this.platform('kaiqi')&&text=='zqtys'){
        msg = h(
          'el-image',
          {
            style:{
              width:'100px',
              height:'100px'
            },
            props: {
                src: require('../../components/img/kaiqi/1.png'),
                'preview-src-list':[require('../../components/img/kaiqi/1.png'),require('../../components/img/kaiqi/2.png')],
            },
          }
        )
      }
      if(this.platform('mingda')&&text=='zqtys'){
        msg = h(
          'el-image',
          {
            style:{
              width:'100px',
              height:'100px'
            },
            props: {
                src: require('../../components/img/mingda/1.png'),
                'preview-src-list':[require('../../components/img/mingda/1.png')],
            },
          }
        )
      }
      this.$alert(
        msg,
        title,
        {
          dangerouslyUseHTMLString: true,
          confirmButtonText: "确定",
        }
      );
    },
    //证件办理费用协议
    openBookXY() {
      //  this.DomImgShow=true
      this.$alert(
        " 一、甲方依据相关规定收取乙方培训、考试、办理及发放证件等费用，并依法对乙方提供相关服务。二、乙方必须按甲方规定时间进行培训、考试及取证，因乙方个人原因及行为不能按时参加培训、考试及无法取证者，甲方不予退费。三、从报名开始，六个月之内必须考完，否则视为自动放弃。四、代办人员需将本协议告知学员本人。",
        "证件办理费用协议",
        {
          confirmButtonText: "确定",
        }
      );
    },
    openBookXl() {
      if (!this.formLabelAlign.education) {
        return this.$message.error("请选择您的学历!");
      }
      this.$alert(`我承诺：本人具有${this.formLabelAlign.education}学历，以上内容真实有效，如有虚假，本人愿意承担相应责任`, "学历承诺", {
        confirmButtonText: "确定",
      });
    },
    //示例图片
    openDefimg(path) {
      this.$alert(
        `<div style="display: flex;justify-content: center;align-items: center;background:#eee;"><img src="${path}" style="height:313px;width:206.5px;" alt="示例图片"></div>`,
        "示例图片",
        {
          confirmButtonText: "确定",
          dangerouslyUseHTMLString: true,
        }
      );
    },
    //提交签名图片
    submit(file) {
      // dialogShow = false
      this.autographPath = this.$refs.autograph.commit();

      if (this.DOMID == "DomImgzjbl") {
        this.autographPath2 = this.$refs.autograph.commit(); //证件办理协议
      } else if (this.DOMID == "DomImgXL") {
        this.autographPath3 = this.$refs.autograph.commit(); //个人学历承诺
      } else if (this.DOMID == "DomImgjkcns") {
        this.autographPath1 = this.$refs.autograph.commit(); //健康承诺书
      }
      if (!this.DOMID) {
        if(this.fileNameWirth=='注意事项'){
          this.autographPath4 = this.$refs.autograph.commit(); //注意事项
        }
        if(this.fileNameWirth=='cxsm'){
          this.autographPath5 = this.$refs.autograph.commit(); //注意事项
        }else
        if(this.fileNameWirth=='cnsx'){
          this.autographPath6 = this.$refs.autograph.commit(); //注意事项
        }else
        if(this.fileNameWirth=='zqtys'){
          this.autographPath7 = this.$refs.autograph.commit(); //注意事项
        }
        else if(this.fileNameWirth=='cnx'){
          this.autographPath8 = this.$refs.autograph.commit(); //注意事项
        }
      }

      upFileqm(this.autographPath, this.formLabelAlign.nickname, {
        field: "signature",
      }).then((res) => {
        if (res.code == 200) {
          this.formLabelAlign.signature = res.data.url;
          if (this.platformAnhui()) {
            this.formLabelAlign.extra[this.fileNameWirth] = res.data.url;
            if(this.DOMID){
              this.formLabelAlign[this.fileNameWirth] = res.data.url;
            }
            this.$message.success("提交成功");
            this.dialogShow = false;
          } 
          if(this.fileNameWirth=='cxsm'||this.fileNameWirth=='cnsx'||this.fileNameWirth=='zqtys'||this.fileNameWirth=='cnx'){
            this.formLabelAlign.extra[this.fileNameWirth] = res.data.url;
            this.$message.success("提交成功");
            this.dialogShow = false;
          }
        } else {
          if (this.platformAnhui()||this.fileNameWirth=='cxsm'||this.fileNameWirth=='cnsx'||this.fileNameWirth=='zqtys'||this.fileNameWirth=='cnx') {
            this.dialogShow = false;
            this.$message.error("签名失败");
          }
        }
      });
      if (!this.platformAnhui()&&this.fileNameWirth!='cxsm'&&this.fileNameWirth!='cnsx'&&this.fileNameWirth!='zqtys'&&this.fileNameWirth!='cnx') {
        setTimeout(() => {
          upFile(this.formLabelAlign.nickname + this.fileNameWirth, { field: this.fileNameWirth }, this.DOMID).then((res) => {
            if (res.code == 200) {
              this.$message.success("提交成功");
              // this.autographPath = res.data.url
              this.formLabelAlign[this.fileNameWirth] = res.data.url;
              this.dialogShow = false;
            } else {
              this.$message.error("签名失败");
            }
          });
        }, 200);
      }
    },
    //下载学历承诺书
    downReader() {
      download("https://lyky.taijieyun.com/template/lyky/%E5%AD%A6%E5%8E%86%E6%89%BF%E8%AF%BA%E4%B9%A6.docx", "学历承诺书.docx");
    },
    //下载健康查体表
    downFuled() {
      download("https://lyky.taijieyun.com/template/lyky/%E4%BD%93%E6%A3%80%E8%A1%A8.doc", "健康查体表.doc");
      //https://lyky.taijieyun.com/template/lyky/%E4%BD%93%E6%A3%80%E8%A1%A8.doc
    },
    //太化 提交
    commitA() {
      if (this.$refs.taihua.commit()) {
        let objA = this.$refs.taihua.commit()[0];
        let objB = this.$refs.taihua.commit()[1];
        this.loading = true;
        applyAdd({ ...objA, extra: JSON.stringify(objB) }).then((res) => {
          this.loading = false;
          if (res.code == 200) {
            this.$confirm("报名成功，管理员审核成功后即可开通培训权限", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "success",
              showClose: false,
            })
              .then(() => {
                this.$router.push("/");
              })
              .catch(() => {});
          } else {
            this.$message.error(res.msg);
          }
        });
      }
    },
  },
};
</script>
<style lang="scss">
  .crop-component .crop-btns .crop-around{
    width: 160px;
    height: 40px;
    border: 1px solid #222222;
    border-radius: 48px;
    cursor: pointer;
    position: relative;
    box-sizing: border-box;
    background: #fff;
    margin-right: 36px;
    &:after {
      content: "旋转90度";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      font-size: 18px;
      color: #222;
      text-align: center;
      line-height: 40px;
    }
  }
  
  
</style>
<style lang="scss" scoped>
.big_box {
  background: url("~@/assets/BmBj.jpg");
  background-size: 100%;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
  // overflow: auto;
}
.conter_box {
  display: flex;
  // justify-content: center;
  // align-items: center;
  width: 63%;
  height: 65%;
  // background: #fff;
  .conter_item_left {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    width: 45%;
    .img_box {
      width: 80px;
      height: 80px;
      margin-bottom: 40px;
      img {
        width: 100%;
      }
    }
    .box_title {
      p {
        color: #fff;
        font-size: 3.7vh;
        margin: 0;
        &::before {
          content: "";
          display: block;
          margin-bottom: 40px;
          width: 28px;
          height: 4px;
          background: #fff;
        }
      }
    }
    .no_copy {
      color: #fff;
      font-size: 14px;
      width: 410px;
    }
  }
  .conter_item_right {
    flex: 1;
    // background: #f0f;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    .positionA {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
      width: 90%;
      height: 80%;
      background: #fff;
      opacity: 0.2;
      border-radius: 24px;
    }
    .positionB {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
      width: 80%;
      height: 90%;
      opacity: 0.2;
      background: #fff;
      border-radius: 24px;
    }
    .positionC {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
      width: 70%;
      height: 100%;
      background: #fff;
      border-radius: 24px;
      .box_form {
        padding: 36px 0;
        height: 100%;
        display: flex;
        flex-direction: column;
        // align-items: center;
        .box_form_title {
          display: flex;
          justify-content: center;
        }
        p {
          font-size: 24px;
          font-weight: 600;
          padding-bottom: 36px;
        }
        .el-form-item {
          margin-bottom: 16px;
        }
        .el-select {
          width: 100%;
        }
        .el-form {
          height: calc(100% - 100px);
          overflow: auto;
          padding: 0 24px;
          &::-webkit-scrollbar {
            width: 5px;
            //   height:5px;
          }
          &::-webkit-scrollbar-thumb {
            border-radius: 15px;
            // -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
            background: rgba(0, 0, 0, 0.2);
          }
          &::-webkit-scrollbar-track {
            // -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
            border-radius: 0;
            background: rgba(0, 0, 0, 0.1);
          }
          ::v-deep {
            .ant-input {
              height: 40px;
            }
            .el-cascader {
              width: 100% !important;
            }
            .el-date-editor {
              width: 100% !important;
            }
          }
          .classJson {
            ::v-deep {
              & > .el-form-item__content {
                margin-left: 0 !important;
              }
            }
          }
        }
        .el-button {
          font-size: 12px;
          padding: 10px 20px;
        }

        // .el-input__inner{
        //     height: ;
        // }
      }
    }
  }
}
@media screen and (min-height:890px) and (max-height:960px) {
  ::v-deep {
    .el-form {
      max-height: calc(100% - 100px) !important;
    }
  }
}
@media screen and (min-height:820px) and (max-height:890px) {
  ::v-deep {
    .el-form {
      max-height: calc(100% - 100px) !important;
    }
  }
}
@media screen and (min-height:760px) and (max-height:820px) {
  ::v-deep {
    .el-form {
      max-height: calc(100% - 100px) !important;
    }
  }
  .conter_box {
    height: 80%;
    width: 75%;
  }
}
@media screen and (min-height:650px) and (max-height:760px) {
  ::v-deep {
    .el-form {
      max-height: calc(100% - 100px) !important;
    }
    .el-form-item__label {
      line-height: 32px;
    }
    .el-form-item__content {
      line-height: 32px;
      .el-input {
        line-height: 32px;
        .el-input__inner {
          height: 32px;
          line-height: 32px;
        }
      }
    }
    .ant-input {
      height: 32px;
    }
    .el-select {
      line-height: 32px;
      .el-input {
        line-height: 32px;
        .el-input__inner {
          height: 32px;
          line-height: 32px;
        }
        .el-input__suffix {
          line-height: 32px;
          .el-input__suffix-inner {
            line-height: 32px;
            .el-select__caret {
              line-height: 32px;
            }
          }
        }
      }
    }
    .el-button {
      font-size: 12px;
      padding: 8px 16px;
    }
  }
  .conter_box {
    height: 85%;
    width: 75%;
  }
}
@media screen and (max-height:650px) {
  ::v-deep {
    .el-form {
      max-height: calc(100% - 100px) !important;
    }
  }
  .conter_box {
    height: 90%;
    width: 75%;
  }
}
::v-deep {
  .el-form-item__content {
    line-height: 16px !important;
  }
  // .crop-around{
  //   &::after{
  //     content: '旋转90度';
  //   }
  // }
}
.DomImg {
  position: absolute;
  z-index: -5;
  background: #fff;
  .A4page {
    width: calc(595.28px);
    height: calc(841.89px);
    // background:url('~@/assets/logo/pdfbg.png') no-repeat;
    overflow: hidden;
    -webkit-print-color-adjust: exact;
    color: #000;
    position: relative;
    padding: 70px 70px;
    u {
      // text-decoration:underline;
      border-bottom: 1px solid #333;
      // display: inline-block;
      // padding:0 80px;
    }
    p {
      margin: 0;
      font-size: 16px;
      line-height: 40px;
    }
    h1 {
      text-align: center;

      // font-weight: 600;
      font-size: 20px;
    }
  }
}
#DomImgzjbl {
  top: 0;
  // z-index: 5;
  .A4page {
    padding: 40px 70px;
    p {
      line-height: 30px;
    }
  }
}
</style>
